/* eslint-disable @typescript-eslint/no-var-requires */
const fs = require('fs')
const gulp = require('gulp')
const del = require('del')
const rename = require('gulp-rename')
const replace = require('gulp-replace')
const sass = require('gulp-sass')
const cleanCSS = require('gulp-clean-css')
const prefixer = require('gulp-autoprefixer')
const merge = require('merge-stream')
const babel = require('gulp-babel')
const uglify = require('gulp-uglify')
const ts = require('gulp-typescript')
const components = []
const files = fs.readdirSync('styles/scss')
files.forEach(function (item, index) {
  components.push(item.substring(0, item.lastIndexOf('.')))
})
const styleCode = 'require(\'./style.css\')'
// 打包各个css到各个组件模块下的src内
gulp.task('build_style', () => {
  const rest = components.map(name => {
    return gulp.src(`styles/scss/${name}.scss`, { allowEmpty: true })
      .pipe(replace(/(\/\*\*Variable\*\*\/)/, '@import \'../variable.scss\';\n'))
      .pipe(replace(/(\/\*\*Mixin\*\*\/)/, '@import \'../mixin.scss\';\n'))
      .pipe(sass())
      .pipe(prefixer({
        borwsers: ['last 1 version', '> 1%', 'not ie <= 8'],
        cascade: true,
        remove: true
      }))
      .pipe(rename({
        basename: 'style',
        extname: '.css'
      }))
      .pipe(gulp.dest(`lib/src/${name}/style`))
      .pipe(cleanCSS())
      .pipe(rename({
        basename: 'style',
        suffix: '.min',
        extname: '.css'
      }))
      .pipe(gulp.dest(`lib/src/${name}/style`))
  })
  return merge(...rest)
})
// 打包rollup生成的css(整个组件所有用的css,包含引用组件的)生成文件名:style.css/style.min.css
gulp.task('build_lib', () => {
  return merge(
    gulp.src('lib/wd-platform-library.min.css', { allowEmpty: true })
      .pipe(rename({ basename: 'style', extname: '.css' }))
      .pipe(gulp.dest('lib'))
      .pipe(rename({
        basename: 'style',
        suffix: '.min',
        extname: '.css'
      }))
      .pipe(gulp.dest('lib'))
  )
})
// 打包utils下的js
gulp.task('build_utils', () => {
  return gulp.src('./utils/**/*.ts')
    .pipe(ts({
      strict: true,
      moduleResolution: 'node',
      noImplicitAny: true,
      target: 'es5',
      module: 'esnext',
      lib: ['dom', 'esnext']
    }))
    .pipe(babel({
      presets: [
        '@babel/env'
      ],
      plugins: []
    }))
    .pipe(gulp.dest('lib/utils'))
    .pipe(uglify())
    .pipe(rename({
      suffix: '.min',
      extname: '.js'
    }))
    .pipe(gulp.dest('lib/utils'))
})
// 打包styles下自定义的css(只生成自定义的)生成文件名:default.css/default.min.css
gulp.task('custom_sass', function () {
  return gulp.src('styles/default.scss', { allowEmpty: true })
    .pipe(prefixer({
      overrideBrowserslist: ['last 2 versions', 'ie > 8']
    }))
    .pipe(sass())
    .pipe(gulp.dest('lib/es')) // 这是转化后css的文件
    .pipe(cleanCSS())
    .pipe(rename({
      basename: 'default',
      suffix: '.min',
      extname: '.css'
    })).pipe(gulp.dest('lib/es'))
})
gulp.task('variable', function () {
  return gulp.src('styles/variable.scss', { allowEmpty: true }).pipe(gulp.dest('lib/es'))
})
gulp.task('mixin', function () {
  return gulp.src('styles/mixin.scss', { allowEmpty: true }).pipe(gulp.dest('lib/es'))
})
// 执行方法
gulp.task('build', gulp.series('build_style', 'build_lib', 'custom_sass', 'build_utils', 'variable', 'mixin', () => {
  components.forEach(name => {
    fs.writeFileSync(`lib/src/${name}/style/index.js`, styleCode)
  })
  return del([
    'lib/wd-platform-library.umd.css',
    'lib/wd-platform-library.esm.css',
    'lib/wd-platform-library.min.css',
    'lib/utils'
  ])
}))
